import {Breadcrumb} from "antd";
import {HomeOutlined, UserOutlined} from "@ant-design/icons";

function CcBreadcrumb(){
    const menuItems = [
        {
            key: '1',
            label: (
                <a target="_blank" rel="noopener noreferrer" href="http://www.alipay.com/">
                    General
                </a>
            ),
        },
        {
            key: '2',
            label: (
                <a target="_blank" rel="noopener noreferrer" href="http://www.taobao.com/">
                    Layout
                </a>
            ),
        },
        {
            key: '3',
            label: (
                <a target="_blank" rel="noopener noreferrer" href="http://www.tmall.com/">
                    Navigation
                </a>
            ),
        },
    ];
    const items = [
        {
            title:<HomeOutlined/>,
            href:"",


        },
        {
          type:"separator",
          separator:":"
        },
        {
            href: "",
            title:(
                <>
                    <UserOutlined/>
                    application center
                </>
            ),

            menu:{
                items:menuItems
            },
        },
        {
            type:"separator",
            separator:">>"
        },
        {
            href: "",
            title:":id"
        }
    ]


    const routes = [
        {
            path:"/home",
            breadcrumbName:"Home"
        },
        {
            path:"/user",
            breadcrumbName: "user"
        }
    ]

    return (
        <div>
            {/*<Breadcrumb items={items} params={{id:1}}  separator=""></Breadcrumb>*/}

            <Breadcrumb routes={routes}></Breadcrumb>
        </div>
    )
}

export default CcBreadcrumb
